<template>
	<view>
		<block v-if="isEdit">
			<textarea class="notice-input" v-model="dataForm.value" placeholder="请填写公告内容" maxlength="-1"
				:auto-height="true"></textarea>
			<!-- 提交按钮 -->
			<q-button shape="circle" @click="onSubmit">提交</q-button>
		</block>
		<block v-else>
			<view style="padding: 30rpx;">
				<text class="notice-content" :selectable="true" user-select>{{dataForm.value}}</text>
			</view>
		</block>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				isEdit: false,
				dataForm: {
					topic_id: '',
					field: 'notice',
					value: ''
				}
			};
		},
		onLoad(options) {
			this.dataForm.topic_id = options.id;

			if (options.isEdit) {
				this.isEdit = true;
			}
			this.getTopicInfo(options.id)
		},
		methods: {
			onSubmit() {
				if (!this.dataForm.value) {
					this.$u.toast('请填写内容');
					return
				}
				this.$H.post('topic/setInfo', this.dataForm).then(res => {
					if (res.code == 1) {
						this.$u.toast('保存成功');
					}
				});
			},
			getTopicInfo(id) {
				this.$H.get('topic/detail', {
					id
				}).then(res => {
					if (res.code == 1) {
						this.dataForm.value = res.result.notice;
					}
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	.notice-input {
		background-color: #f5f5f5;
		border-radius: 10rpx;
		padding: 30rpx;
		display: block;
		margin: 30rpx;
		width: calc(100% - 120rpx);
		min-height: 70vh;
	}

	.notice-content {
		display: block;
		white-space: pre-wrap;
		line-height: 1.8;
		background-color: #f5f5f5;
		border-radius: 20rpx;
		padding: 30rpx;
	}
</style>